<!DOCTYPE html>
       <html manifest="demo.appcache">
<head>
    <title>robot's fight</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

    <link rel="stylesheet" type="text/css" href="css/normalize.css" />
    <link rel="stylesheet" type="text/css" href="css/main.css" />
    <link rel="stylesheet" type="text/css" href="css/style4.css" />
    <link rel="stylesheet" type="text/css" href="css/font-awesome.css">
</head>
<body style="text-align: center;height: 100%;position: fixed;width: 100%;">

<script src="./physicsjs-full.js"></script>
<script src="./custom.js"></script>
<script src="./behavior.js"></script>




<div style=" height:100%;" id="mes">
<canvas id="viewport" width="300" height="500" style="background: url('./images/background.jpg')">
</canvas>
<br/>
<!-- Container -->
<div class="container" id="container" style="display: inline-block; margin-left: auto;margin-right: auto;">
    <section style="float: left ;">
        <p><button id="trigger-overlay" type="button" class="class-trigger">asdasd</button></p>
    </section>
</div>
</div>
<!-- Container end -->
<div class="overlay overlay-slidedown" id="overlay">

    <button type="button" class="overlay-close" onclick="showScreen();">Close</button>
    <nav>
        <ul>
            <li><a  href="#" onclick="document.body.appendChild(mm1); document.body.appendChild(mcustom);
            document.body.appendChild(main);showScreen();">Map1</a></li>
            <li><a href="#"
                   onclick="document.body.appendChild(mm2); document.body.appendChild(mcustom);
                   document.body.appendChild(main);showScreen();">Map2</a></li>
         </ul>
    </nav>

</div>

<!-- js on bottom for speed-->

<!-- js on bottom for speed end -->


<script src="./jquery.min.js"></script>

<script type="text/javascript">
    var w=0;
    var mesbox=document.getElementById("mes");
 //   mesbox.innerHTML=contact.getFunList();
    var container=document.getElementById("container");
    var intro=document.getElementById("overlay");
    var items="";


</script>


<script>
</script>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="js/mousetrap.min.js"></script>
<script src="js/modernizr.custom.js"></script>
<script src="js/classie.js"></script>
<script src="js/cmdscriptmin.js"></script>
<script>
    var mm1=document.createElement('script');
    mm1.src='./map/map1.js';
    var mm2=document.createElement('script');
    mm2.src='./map/map2.js';
    var main=document.createElement('script');
    main.src='./main.js';
    var mcustom=document.createElement('script');
    mcustom.src='./js/custom.js';
    showScreen();
</script>
</body>
</html>
<!-- section with buttons
<section style="float: left ;" onclick="showScreen()">
    <p><button id="trigger" type="button"> name</button></p>
</section>-->
<!-- section with buttons end
<section style="float: left">

    <p><button id="trigger-overlay" type="button">asdasd</button></p>
</section>-->